
import React, { Component } from 'react';
import {Layout,Breadcrumb} from "antd";
import {Redirect, Switch,Route} from "react-router-dom"
import {observer} from "mobx-react"
import myuser from '../../mobx/myuser';
import MyHead from './head';
import SideMenu from './SideMenu';
import Home from '../home';
import UserList from '../users/useradd';
import Tian from '../anno/tian'
import PeiList from '../adv/list';
import Gong from '../anno/gong'
import Mine from '../mine/index'
import KucunTu from '../adv/kucun';
import Chukudan from '../adv/chuku';
import ChuList from '../adv/chuList';
import {Preview} from '../adv/preview';
import Lister from "../users/lister"
import {Dongtai} from '../dongtai/donftai';

const {Sider,Content,Footer} = Layout
@observer
class MainCpt extends Component {

    state={
        names:[],
    }

    componentDidMount(){
        if(!myuser.user.phone){
            myuser.changeUser()     //user 有数据 表明已经登录获取用户的数据        没有数据    第一次请求  以后就不会再次请求
        }

        const {pathname}=this.props.location
        const names=pathname.split("/")
        var txt=""
        names.forEach((item,i)=>{
            txt+="/"+item
            this.state.names.push({
                title:txt,
                index:i,
                name:item
            })
        })
        this.setState({
            names:this.state.names
        })
    }


    render() {
        return (
            <Layout style={{width:"100%",height:"100%",backgroundColor:"#ccc"}}>
                <SideMenu/>
                 <Layout >
                    <MyHead/>
                    <Layout style={{padding:'0 24px'}}>
                        <Breadcrumb style={{ margin: '16px 0' }}>
                            {
                                this.state.names.map((item,index)=>(
                                    <Breadcrumb.Item key={index}>{item.name}</Breadcrumb.Item>
                                ))
                            }
                        </Breadcrumb>
                        {/* <div style={{margin:"16px 0"}}></div> */}
                        <Content
                            className="site-layout-background"
                            style={{
                                padding:10,
                                margin:0,
                                minHeight:300,
                                height:'100%',
                                overflow:'auto',
                                background:"#fff"
                            }}
                        >
                            <Switch>
                                <Route path="/main" exact component={()=><Redirect to="/main/home"/>} />
                                <Route path="/main/home" component={Home} />
                                <Route path="/main/mine" component={Mine} />
                                <Route path="/main/dongtai" component={Dongtai} />
                                <Route path="/main/user" component={
                                    ()=>(
                                        <Switch>
                                            <Route path="/main/user" exact component={()=><Redirect to="/main/user/add"/>} />
                                            <Route path="/main/user/add" component={UserList} />
                                            <Route path="/main/user/lister" component={Lister} />
                                        </Switch>
                                    )
                                }/>

                                <Route path="/main/anno" component={
                                    ()=>(
                                        <Switch>
                                            <Route path="/main/anno" exact component={()=><Redirect to="/main/user/add"/>} />
                                            <Route path="/main/anno/tian" component={Tian} />
                                            <Route path="/main/anno/gong" component={Gong} />
                                        </Switch>)
                                        }/>


                                <Route path="/main/advise" component={
                                    ()=>(
                                        <Switch>
                                            <Route path="/main/advise" exact component={()=><Redirect to="/main/advise/list"/>} />
                                            <Route path="/main/advise/list" component={PeiList} />
                                            <Route path="/main/advise/kucun" component={KucunTu} />
                                            <Route path="/main/advise/biao" component={Chukudan} />
                                            <Route path="/main/advise/time" component={ChuList} />
                                            <Route path="/main/advise/preview" component={Preview} />
                                        </Switch>
                                    )
                                }/>
                                <Route component={()=><Redirect to="/main/home" /> }/>
                            </Switch>
                        </Content>
                        <Footer style={{ textAlign: 'center',padding:"10px 0" }}>Ant Design ©2018 德添汽车维修4S店Created by Ant UED</Footer>
                    </Layout>
                </Layout>
            </Layout>
        );
    }
}

export default MainCpt;